$(function () {
  var currentPage = 1;
  var pageSize = 3;
  var picArr = []; //用于存放最近上传三张图片
  // 请求渲染第一屏数据
  function render() {
    $.ajax({
      url: '/product/queryProductDetailList',
      data: {
        page: currentPage,
        pageSize: pageSize
      },
      dataType: 'json',
      success: function (info) {
        // console.log(info)
        $('tbody').html(template('tmp', info))
        setPage(info.total);
      }
    })
  }
  render();

  // 分页
  function setPage(total) {
    $('#paginator').bootstrapPaginator({
      bootstrapMajorVersion: 3,//默认是2，如果是bootstrap3版本，这个参数必填
      currentPage: currentPage,//当前页
      totalPages: Math.ceil(total / pageSize),//总页数
      onPageClicked: function (event, originalEvent, type, page) {
        //为按钮绑定点击事件 page:当前点击的按钮值
        currentPage = page; //记录当前页变化
        render();
      }
    });
  }

  // 填充二级分类数据
  $.ajax({
    url:'/category/querySecondCategoryPaging',
    data:{
      page:1,
      pageSize:100
    },
    dataType:'json',
    success:function(info){
      // console.log(info)
      // console.log($('.brand-list'))
      $('.brand-list').html(template('tmp-brand', info));
    }
  })

  // 点击二级分类下拉列表,把选择品牌文字赋值给按钮,用隐藏域保持数据id
  $('.brand-list').on('click','a',function(){
    // 把当前a标签文字,赋值给按钮
    $('.title-text').text($(this).text());
    // 隐藏保持数据id
    $('[name="brandId"]').val($(this).data('id'));
    // 品牌id 验证状态设置为通过
    $('#form1').data('bootstrapValidator').updateStatus('brandId', 'VALID');
  })

  // 上传商品图片
  // 需要保留最新上传 三张,显示最新上传3张图片

  $('#file').fileupload({
    dataType:'json',
    
    done:function(e,data){
      console.log(data)
      picArr.unshift(data.result)
      console.log(picArr)
      $('.pic-box').prepend('<img src="' + data.result.picAddr + '" height="100" >')
      if(picArr.length > 3) {
        picArr.pop();
        $('.pic-box img:last-child').remove();
      }
      if(picArr.length == 3) {
        $('#form1').data('bootstrapValidator').updateStatus('picStatus','VALID');
      }
    }
  })

  //对表单进行验证
  $('#form1').bootstrapValidator({

    //1. 指定不校验的类型，默认为[':disabled', ':hidden', ':not(:visible)'],可以不设置
    excluded: [],

    //2. 指定校验时的图标显示，默认是bootstrap风格
    feedbackIcons: {
        valid: 'glyphicon glyphicon-ok',
        invalid: 'glyphicon glyphicon-remove',
        validating: 'glyphicon glyphicon-refresh'
    },

    //3-字段
    fields: {
        brandId: {
            validators: {
                notEmpty: {
                    message: '请选择二级分类！'
                }
            }
        },
        proName: {
            validators: {
                notEmpty: {
                    message: '请输入商品名称！'
                }
            }
        },
        proDesc: {
            validators: {
                notEmpty: {
                    message: '请输入商品描述！'
                }
            }
        },
        num: {
            validators: {
                notEmpty: {
                    message: '请输入商品库存！'
                },
                //正则校验
                regexp: {
                    //要验证正则表达式
                    regexp: /^[1-9]\d*$/,
                    message: '商品库存必须是非零开头数字！'
                }
            }
        },
        size: {
            validators: {
                notEmpty: {
                    message: '请输入商品尺码！'
                },
                //正则校验
                regexp: {
                    regexp: /^[1-9]\d{1}-[1-9]\d{1}$/,
                    message: '商品尺码必须是 xx-xx格式， x是数字'
                }
            }
        },
        oldPrice: {
            validators: {
                notEmpty: {
                    message: '请输入商品原价！'
                }
            }
        },
        price: {
            validators: {
                notEmpty: {
                    message: '请输入商品现价！'
                }
            }
        },
        picStatus: {
            validators: {
                notEmpty: {
                    message: '图片必须上传3张！'
                }
            }
        }
    }
})
// 表单验证通过后,向后台发送ajax请求,添加商品数据
$('#form1').on('success.form.bv',function(e){
  e.preventDefault()
  var str = $('#form1').serialize();
  str += '&' + "picArr" + JSON.stringify(picArr);

  $.ajax({
    url:'/product/addProduct',
    type:'post',
    data:str,
    dataType:'json',
    success:function(info) {
      $('.modal-add').modal('hide')
      currentPage = 1;
      render();
      $('#form1').data('bootstrapValidator').resetForm(true)
      $('.pic-box').empty();
      $('title-text').text('请选择二级分类')
      picArr = [];
    }
  })


})



})